﻿<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>小孙同学</title>
  <meta name="language" content="zh-CN">
  <meta name="title" content="小孙同学">
  <meta name="github" content="https://github.com/sun0225SUN/Awesome-Love-Code">
  <meta name="describe" content="收集不易，您的star是我坚持的动力，同时也欢迎各位PR哦! ">
  <link rel="icon" type="image/x-icon" href="https://cdn.jsdelivr.net/gh/sun0225SUN/photos/img/20210715233345.png">
  <link type="text/css" rel="stylesheet" href="css/theme.css" />
  <script src="js/jquery-2.0.3.min.js"></script>
</head>

<body>
  <div id="div_container">
    <!-- 最外层div，用于居中兼容PC和移动 -->
    <div id="div_start_bg"></div>
    <div id="div_onlyyou">
      <!-- 用于设置背景 -->
      <div id="div_oy_inner">
        <!-- 用于存放content -->
        <div class="div_oy_text">
          <h1></h1>
          <img class="img_oy_text" src="" />
          <p class="p_oy_text"></p>
          <div></div>

          <ul id="ul_oy_benefit">
            <li class="li_oy_benefit"></li>
            <li class="li_oy_benefit"></li>
            <li class="li_oy_benefit"></li>
            <li class="li_oy_benefit"></li>
            <li class="li_oy_benefit"></li>
            <li class="li_oy_benefit"></li>
            <li class="li_oy_benefit"></li>
            <li class="li_oy_benefit"></li>
            <li class="li_oy_benefit"></li>
            <li class="li_oy_benefit"></li>
            <li class="li_oy_benefit"></li>
            <li class="li_oy_benefit"></li>
            <li class="li_oy_benefit"></li>
            <li class="li_oy_benefit"></li>
            <li class="li_oy_benefit"></li>
            <li class="li_oy_benefit"></li>
            <li class="li_oy_benefit"></li>
            <li class="li_oy_benefit"></li>
            <li class="li_oy_benefit"></li>
            <li class="li_oy_benefit"></li>
          </ul>
        </div>
        <ul id="ul_oy_btn">

          <li onclick="oy_go_next()">Yes&nbsp;&nbsp;❤</li>
          <li onclick="oy_show_benefit()">No&nbsp;&nbsp;✖</li>
        </ul>
        <div id="div_oy_note" onclick="oy_hide_note()">
          <img src="images/emoji_kelian.jpg" alt="" /><br />请告诉我Yes！
          <div id="div_oy_note_close">✖</div>
        </div>
        <div id="div_oy_yes">
          <img src="images/emoji_bixin.jpg" alt="" /><br />太好了！哈哈~
        </div>
      </div>
    </div>
    <div class="div_pure_words">
      <div class="div_pure_words_bg">
        <div class="div_pure_words_height"></div>
      </div>
      <div class="div_pw_typed">
        <span id="span_pw_typed"></span>
      </div>
    </div>
    <div id="div_btn_container">
      <div id="div_btn_inner">

        <div class="div_music_tips"></div>
        <div class="div_btn" id="div_music" onclick="music_switch()">
          <!-- 音乐按钮部分 -->
          <img id="img_music" src="images/music_note_big.png"
            style="-webkit-animation: music_play_rotate 1s linear infinite;" />
          <!-- 您的浏览器不支持播放音乐 -->
          <audio id="audio_music" autoplay="autoplay" loop="loop">
            <source type="audio/mpeg" />
          </audio>
        </div>
        <div class="div_record_tips"></div>
        <div class="div_btn" id="div_record" onclick="record_switch()">
          <audio id="audio_record" loop="loop">
            <source type="audio/mpeg" />
          </audio>
        </div>

      </div>

    </div>

  </div>


  <script>
    //判断客户端设备，选择写入meta
    function init_viewport() {
      if (navigator.userAgent.indexOf("Android") != -1) {
        var version = parseFloat(RegExp.$1);
        if (version > 2.3) {
          var width =
            window.outerWidth == 0 ? window.screen.width : window.outerWidth;
          var phoneScale = parseInt(width) / 500;
          document.write(
            '<meta name="viewport" content="width=500, minimum-scale = ' +
            phoneScale +
            ", maximum-scale = " +
            phoneScale +
            ', target-densitydpi=device-dpi">'
          );
        } else {
          document.write(
            '<meta name="viewport" content="width=500, target-densitydpi=device-dpi, user-scalable=0">'
          );
        }
      } else if (navigator.userAgent.indexOf("iPhone") != -1) {
        var phoneScale = parseInt(window.screen.width) / 500;
        document.write(
          '<meta name="viewport" content="width=500, min-height=750, initial-scale=' +
          phoneScale +
          ", maximum-scale=" +
          phoneScale +
          ', user-scalable=0" /> '
        ); //0.75   0.82
      } else {
        document.write(
          '<meta name="viewport" content="width=500, height=750, initial-scale=0.64" /> '
        ); //0.75  0.82
      }
    }
    init_viewport();

    var theme = "pure_words";
    console.log("theme ->" + theme);
    var theme_content = {
      pure_words_content:
        "遇见你，是我所有美好故事的开始，看见你的第一眼，上帝就在我耳边说了四个字，在劫难逃!\n你的过去我来不及参与，你的未来我一定奉陪到底！\n我爱你！<um style='color: #F44336;'>💕</um>",
      typed_bool: "typed_y",
      cursor_char: "cursor_heart",
      bg_style_pure_words: "bg_opacity",
      bg_img: "images/3.jpg",
      simple_page_content: "",
      video_page_content: "",
    };
    console.log(theme_content);

    var music_json = {
      music_select: "m_online",
      m_online_id: "7",
      m_online_url: "images/1.mp3",
      m_upload_name: "null",
      m_upload_url: "null",
    };
    console.log(music_json);
    var record_json = {
      record_bool: "r_false",
      r_wechat_time: "null",
      r_wechat_url: "null",
      r_wechat_amr: "null",
    };
    console.log(record_json);

    var main_title = "我喜欢你❤️";

    // console.log(main_title);
    if (main_title == "" || main_title == "null") {
      //允许标题为空
      document.title = "慢慢喜欢你";
    }

    var window_height = $(window).height();
    console.log("window_height ->" + window_height);
    var pure_words_content = theme_content["pure_words_content"];
    var str_cursorChar;
    var typed_bool;
    var interval_pw_height;
    var height_div_pw = $(".div_pure_words_height").height();
    function init_pure_words() {
      $(".div_pure_words_height").html(pure_words_content + "22222"); //初始化复制内容，撑开文档高度
      // 初始化设置div的bg图片 初始化设置div的bg图片
      if (
        typeof theme_content["bg_style_pure_words"] != "undefined" &&
        theme_content["bg_style_pure_words"] == "bg_opacity"
      ) {
        if (
          typeof theme_content["bg_img"] != "undefined" &&
          theme_content["bg_img"] != ""
        ) {
          $(".div_pure_words_bg").css({
            "background-image": "url(" + theme_content["bg_img"] + ")",
          });
        }
      }
      //以下是打字效果的js
      if (
        typeof theme_content["cursor_char"] != "undefined" &&
        theme_content["cursor_char"] != ""
      ) {
        switch (
        theme_content["cursor_char"] //设置打字光标的样式
        ) {
          case "cursor_heart":
            str_cursorChar = '<um style="color: #F44336;">❤</um>';
            break;
          case "cursor_sub":
            str_cursorChar = "_";
            break;
          case "cursor_music":
            str_cursorChar = "♫";
            break;
          case "cursor_star":
            str_cursorChar = "★";
            break;
          case "cursor_sun":
            str_cursorChar = "☀";
            break;
          default:
            str_cursorChar = "|";
        }
      } else {
        //处理全新作品，默认显示打字效果
        str_cursorChar = "❤";
      }
      //判断用户有没有选择打字效果
      if (
        typeof theme_content["typed_bool"] != "undefined" &&
        theme_content["typed_bool"] != ""
      ) {
        typed_bool = theme_content["typed_bool"] == "typed_y" ? true : false;
      } else {
        typed_bool = false; //默认显示打字效果
      }
      display_pure_words();
      $(".div_pure_words").fadeIn();
      interval_pw_height = setInterval(function () {
        console.log(
          "div_pure_words_height -> " + $(".div_pure_words_height").height()
        );
        var least_height_div_pw = $(".div_pure_words_height").height();
        if (least_height_div_pw > height_div_pw) {
          height_div_pw = least_height_div_pw;
        } else {
          clearInterval(interval_pw_height);
          $(".div_pure_words_height").height(least_height_div_pw + 100);
          if ($(".div_pure_words_height").height() < window_height) {
            $(".div_pure_words_height").height(window_height); //不能小于窗口的高度
            console.log("let us be high as window");
          }
        }
      }, 100);
    }

    function display_pure_words() {
      if (typed_bool) {
        var typed_pure_words = new Typed("#span_pw_typed", {
          strings: [pure_words_content],
          //输入内容, 支持html标签
          typeSpeed: 120,
          //打字速度
          cursorChar: str_cursorChar,
          //替换光标的样式
          contentType: "html",
          //值为html时，将打印的文本标签直接解析html标签
          onComplete: function (abc) {
            // console.log(abc);
            console.log("finished typing words");
            // console.log($('#span_pw_typed').height()-$(".div_pure_words_height").height());
          },
        });
      } else {
        //如果不需要打字效果就直接显示
        $("#span_pw_typed").html(pure_words_content).fadeIn();
      }
      init_attachment();
    }
    var start_content = {
      chase_title:
        "做我女朋友好不好<um style='color: #F44336;'>！</um>",
      chase_text:
        "承蒙你的出现，够我喜欢好多年，我希望，以后你能用我的名字拒绝所有人<um style='color: #F44336;'>💕</um>",
      chase_benefit: [
        "你是我拔掉氧气罐都想吻的人",
        "你是我跑完8000米还想拥抱的人",
        "你是我自罚三杯都不肯开口的秘密",
        "你是我赴汤蹈火都不肯放下的执着",
        "你是我电量只剩1%也想回信息的人",
        "你是我穷极一生不想醒来的梦",
      ],
      bg_style: "bg_custom",
      bg_img: "images/2.jpg",
      img_bool: "img_true",
      img_src: "images/1.gif",
    }; //可能为null
    console.log(start_content);
    var start_id;
    $(function () {
      //此事件为触发互动创意
      start_id = "onlyyou"; //可能为null
      init_start(start_id);
    });
    function init_start(start_id) {
      console.log("init_start ->" + start_id);
      switch (start_id) {
        case "loveformat":
          $(".div_loveformat").show();
          init_loveformat();
          break;
        case "hearttree":
          $("#div_hearttree").show();
          init_hearttree();
          break;
        case "courage":
          $("#div_courage").show();
          init_courage();
          break;
        case "birthdaycake":
          $("#div_dbcake").show();
          init_birthdaycake();
          break;
        case "intersect":
          $("#div_intersect").show();
          init_intersect();
          break;
        case "onlyyou":
          $("#div_onlyyou").show();
          init_onlyyou();
          break;
        default:
          init_theme();
      }
    }
    //开始动画主体部分
    function init_theme() {
      console.log("init_theme");
      $("#div_start_bg").fadeOut();
      init_pure_words();
    }
    var attachment = "null"; //可能为null
    var attached_content = {
      bool_save: false,
    }; //可能为null
    console.log(attached_content);

    function init_attachment() {
      //开始attachment
      console.log("init_attachment ->" + attachment);
      switch (attachment) {
        case "timer":
          init_at_timer();
          break;
        default:
          return;
      }
    }
  </script>
  <!-- JQuery -->
  <script src="js/typed.min.js"></script>
  <script src="js/start_onlyyou.js"></script>
  <script src="js/jweixin-1.2.0.js"></script>
  <script src="js/theme_common.js"></script>
</body>

</html>
